<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册</title>
    <link rel="stylesheet" href="css/common.css">
    <link rel="stylesheet" href="css/login.css">
</head>
<body>
    <!-- 导航栏 -->
    <div class="nav">
        网页聊天室
     </div>
     <!-- 主窗口区 -->
     <div class="login-container">
            <div class="login-dialog">
                <h3>注册</h3>
                <div class = "row">
                    <span>用户名</span>
                    <input type="text" id = "username">
                </div>
                <div class = "row">
                    <span>密码</span>
                    <input type="password" id = "password">
                </div>
                <div class = "row">
                    <button id = "submit">注册</button>
                </div>
            </div>
     </div>
     <script src="js/jquery-3.5.1.min.js"></script>
     <script>
        var submitButton = document.querySelector('#submit');
        submitButton.onclick = function() {
            //1.先获取到输入框请求
            var username = document.querySelector('#username').value;
            var password = document.querySelector('#password').value;
            if(username == '' || username == null) {
                alert("当前输入用户名不能为空!")
                return;
            }
            if(password == '' || password == null) {
                alert("当前输入密码不能为空!")
                return;
            }
            //2.发送ajax请求
            $.ajax({
                url: '/register',
                type:'post',
                data:{
                    "username": username,
                    "password": password
                },
                success:function(result){
                    //3.处理响应
                    //此处body里返回的user对象
                    if(result && result.userId > 0) {
                        alert("注册成功!");
                        location.assign('/login.html');
                    }else{
                        alert("注册失败!");
                    }
                }
            });
        }
     </script>
</body>
</html>